@media screen and (max-width: 768px) {
  .banner5 {
    flex-direction: column;
    .left {
      padding-right: 0;
      .introduce {
        margin-top: 82px;
      }
    }
    .right {
      margin-left: -123px;
      margin-right: -123px;
      height: auto;
      flex-direction: column;
      overflow: hidden;
      margin-top: 0;
      margin-bottom: var(--yd-gap);
      &::before,
      &::after {
        display: none;
      }
      & > div {
        display: inline;
        flex-direction: row;
        white-space: nowrap;
        .card {
          display: inline-block;
          width: 696px;
          height: 246px;
          position: relative;
          margin-right: 82px !important;
          border-radius: 41px;
          padding: 72px 46px;
          &:last-child {
            margin-right: 0;
          }
          img {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 609px;
            height: 102px;
          }
        }
      }
      &.skeleton {
        & > div {
          &:first-child {
            transform: translateX(-200px);
          }
          &:last-child {
            transform: translateX(-500px);
          }
        }
      }
    }
  }
}
